<template>
  <DaprPlusTable
    :table-title="$t('daprplus.auth.resource.list')"
    :grid-options="gridOptions"
    :query-api="(query) => getResourcePageApi(query, urlPrefix)"
    :create-api="(dtos) => createResourcesApi(dtos, urlPrefix)"
    :update-api="(dtos) => updateResourcesApi(dtos, urlPrefix)"
    :delete-api="(ids) => deleteResourcesApi(ids, urlPrefix)"
    :default-new-record="createDefaultResource"
    @update:grid-api="onGridApiUpdate"
  />
</template>

<script lang="ts" setup>
import type { ExtendedVxeGridApi, VxeGridProps } from '#/adapter/vxe-table';
import { DaprPlusTable } from '#/components/daprplus';
import { createBooleanColumn } from '#/utils/daprplus';
import {
  type ResourceInDto,
  type ResourceOutDto,
  type ServiceName,
  ResourceType,
  ResourceAccessType,
  getResourcePageApi,
  createResourcesApi,
  updateResourcesApi,
  deleteResourcesApi,
} from '#/api/daprplus/auth/resource';
import { computed } from 'vue';

// 定义 props
const props = defineProps<{
  serviceName: ServiceName;
}>();

const urlPrefix = computed(() => {
  switch (props.serviceName) {
    case 'IdentityApi':
      return 'identity';
    case 'SoftwaresApi':
      return 'softwares';
    case 'GamesApi':
      return 'games';
    default:
      return 'identity';
  }
});

// 验证规则
const validRules = {
  name: [
    { required: true, message: '资源名称不能为空' },
    { min: 2, max: 50, message: '资源名称长度应在2-50个字符之间' },
  ],
  code: [
    { required: true, message: '资源代码不能为空' },
    { min: 2, max: 200, message: '资源代码长度应在2-200个字符之间' },
  ],
  serviceName: [
    { required: true, message: '服务名称不能为空' },
    { min: 2, max: 50, message: '服务名称长度应在2-50个字符之间' },
  ],
  description: [{ max: 500, message: '描述长度不能超过500个字符' }],
};

// 资源类型选项
const resourceTypeOptions = [
  { label: 'API端点', value: ResourceType.Api },
  { label: '服务功能', value: ResourceType.Function },
  { label: '数据实体', value: ResourceType.Entity },
  { label: 'UI组件', value: ResourceType.UI },
  { label: '文件和文档', value: ResourceType.File },
];

// 访问类型选项
const accessTypeOptions = [
  { label: '无访问权限', value: ResourceAccessType.None },
  { label: '匿名访问', value: ResourceAccessType.Anonymous },
  { label: '登录访问', value: ResourceAccessType.LoggedIn },
  { label: '角色限制', value: ResourceAccessType.RoleLimit },
];

// 扩展配置
const gridOptions: VxeGridProps<ResourceOutDto> = {
  editRules: validRules,
  columns: [
    { type: 'checkbox', width: 40 },
    {
      field: 'id',
      title: '编号',
      sortable: true,
      width: 130,
    },
    {
      field: 'name',
      title: '资源名称',
      sortable: true,
      align: 'left',
      minWidth: 120,
      editRender: { name: 'input' },
    },
    {
      field: 'code',
      title: '资源代码',
      align: 'left',
      minWidth: 300,
      editRender: { name: 'input' },
    },
    {
      field: 'serviceName',
      title: '服务名称',
      align: 'left',
      width: 120,
      editRender: { enabled: false },
    },
    {
      field: 'type',
      title: '资源类型',
      width: 100,
      editRender: {
        name: 'select',
        options: resourceTypeOptions,
      },
    },
    {
      field: 'accessType',
      title: '访问类型',
      width: 100,
      editRender: {
        name: 'select',
        options: accessTypeOptions,
      },
    },
    {
      field: 'description',
      title: '描述',
      align: 'left',
      minWidth: 200,
      editRender: { name: 'input' },
    },
    createBooleanColumn('isSystem', '系统资源', {
      editRender: { enabled: false },
    }),
    createBooleanColumn('isLocked', '已锁定'),
  ],
};

let gridApi: ExtendedVxeGridApi;

function onGridApiUpdate(api: ExtendedVxeGridApi) {
  gridApi = api;
}

function createDefaultResource(): ResourceInDto {
  return {
    id: '0',
    name: '新资源',
    code: '',
    serviceName: props.serviceName,
    type: ResourceType.Api,
    accessType: ResourceAccessType.Anonymous,
    description: '',
    isAccessTypeChanged: false,
    isLocked: false,
    metadata: {},
  };
}
</script>

<style scoped></style>
